Page({
  fn1() {
    // 获取页面中的节点信息, 与 WXS 中的操作是有区别的
    
    // 1. 先创建一个 SelectQuery 对象
    const query = wx.createSelectorQuery()
    // 2. 调用 SelectQuery 对象 select 方法来选择节点, 得到一个 NodeRef 对象
    //         SelectQuery 对象 selectAll 方法来选择节点，
    //         SelectQuery 对象 exec 方法来执行查询操作
    const node = query.select('.box')
    // 3. 调用 NodeRef 对象的 boundingClientRect
    node.boundingClientRect().exec((info) => {
      console.log('info', info)
    })
  },

  fn2() {
    // 1. 创建 SelectQuery
    const query = wx.createSelectorQuery()
    // 2. 调用 query.selectViewport, 获取一个 NodesRef
    const node = query.selectViewport()
    // 3. 调用 node.
    node.scrollOffset((info) => {
      console.log('info', info)
    }).exec()
  },

  fn3() {
    // 1. 创建 SelectQuery
    const query = wx.createSelectorQuery()
    query.select('.box').boundingClientRect().selectViewport().scrollOffset().exec(([rect, offset]) => {
      console.log('rect', rect)
      console.log('offset', offset)
    })
  } 
})